<template>
  <div>
    <tableComponents
      :pagination="{currentPage,pageSize,total:list.all_num}"
      @handleCurrentChange="handleCurrentChange"
      @handleSizeChange="handleSizeChange"
      @sendUserSearch="getSearch"
      :searchData="userSearchData"
      :isHaveExport="false"
      :isHaveAdd="false"
    >
      <template v-slot:headRight>
        <div class="fx head-right-icon">
          <p @click="show_goods = true">
            <i class="el-icon-position"></i>&nbsp;&nbsp;采集
          </p>
        </div>
      </template>
      <template v-slot:table>
        <el-table
          ref="multipleTable"
          :data="list.data"
          v-loading="loading"
          header-row-class-name="head_color"
          stripe
          tooltip-effect="dark"
          style="width: 99.9%"
          @selection-change="handleSelectionChange"
        >
          <el-table-column type="selection" class="tc" width="35"></el-table-column>

          <el-table-column label="商品图片" width="100" align="center">
            <template slot-scope="scope">
              <div class="img_bor">
                <img :src="$fnc.getImgUrl(scope.row.goods_image_url)" alt />
              </div>
            </template>
          </el-table-column>

          <el-table-column label="标题" min-width="130">
            <template slot-scope="scope" style="vertical-align: text-top;">
              <div class="tab_div">
                <div>{{scope.row.goods_name}}</div>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="售价" min-width="120">
            <template slot-scope="scope">
              <div class="tab_div">
                <div>
                  <span>最小拼团价：</span>
                  <p>{{scope.row.min_group_price | keepTwoNum}}</p>
                </div>
                <div>
                  <span>最小单买价格：</span>
                  <p>{{scope.row.min_normal_price | keepTwoNum}}</p>
                </div>
                <div>
                  <span>已售卖件数：</span>
                  <p>{{scope.row.sales_tip}}</p>
                </div>
                <div>
                  <span>佣金(千分比)：</span>
                  <p>{{scope.row.promotion_rate | keepTwoNum }}</p>
                </div>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="卖家信息" min-width="150">
            <template slot-scope="scope">
              <div class="tab_div">
                <div>
                  <span>店铺名字：</span>
                  <p>{{scope.row.mall_name}}</p>
                </div>
                <div>
                  <span>店铺类型：</span>
                  <span>{{merchant_type[scope.row.merchant_type]}}</span>
                </div>
                <div>
                  <span>描述分：</span>
                  <span>{{scope.row.desc_txt}}</span>
                </div>
                <div>
                  <span>服务分：</span>
                  <span>{{scope.row.serv_txt}}</span>
                </div>
                <div>
                  <span>物流分：</span>
                  <span>{{scope.row.lgst_txt}}</span>
                </div>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="优惠券" min-width="150">
            <template slot-scope="scope">
              <div class="tab_div" v-if="scope.row.has_coupon!=0">
                <div>
                  <span>总数量：</span>
                  <span>{{scope.row.coupon_total_quantity}}</span>
                </div>
                <div>
                  <span>剩余数量：</span>
                  <span>{{scope.row.coupon_remain_quantity}}</span>
                </div>
                <div>
                  <span>门槛价格：</span>
                  <span>{{scope.row.coupon_min_order_amount | keepTwoNum}}</span>
                </div>
                <div>
                  <span>面额：</span>
                  <span>{{scope.row.coupon_discount | keepTwoNum}}</span>
                </div>
                <div>
                  <span>生效时间：</span>
                  <p>{{scope.row.coupon_start_time | getTimeFormat}}</p>
                </div>
                <div>
                  <span>失效时间：</span>
                  <p>{{scope.row.coupon_end_time | getTimeFormat}}</p>
                </div>
              </div>
              <div class="tab_div" v-else>暂无</div>
            </template>
          </el-table-column>

          <el-table-column label="店铺券" min-width="150">
            <template slot-scope="scope">
              <div class="tab_div" v-if="scope.row.has_mall_coupon!=0">
                <div>
                  <span>总数量：</span>
                  <span>{{scope.row.mall_coupon_total_quantity}}</span>
                </div>
                <div>
                  <span>剩余数量：</span>
                  <span>{{scope.row.mall_coupon_remain_quantity}}</span>
                </div>
                <div>
                  <span>折扣：</span>
                  <span>{{scope.row.mall_coupon_discount_pct}}</span>
                </div>
                <div>
                  <span>最小使用金额：</span>
                  <span>{{scope.row.mall_coupon_min_order_amount | keepTwoNum}}</span>
                </div>
                <div>
                  <span>最大使用金额：</span>
                  <span>{{scope.row.mall_coupon_max_discount_amount | keepTwoNum}}</span>
                </div>
                <div>
                  <span>开始使用时间：</span>
                  <p>{{scope.row.mall_coupon_start_time | getTimeFormat}}</p>
                </div>
                <div>
                  <span>结束使用时间：</span>
                  <p>{{scope.row.mall_coupon_end_time | getTimeFormat}}</p>
                </div>
              </div>
              <div class="tab_div" v-else>暂无</div>
            </template>
          </el-table-column>

          <el-table-column label="店铺收藏券" min-width="150">
            <template slot-scope="scope">
              <div class="tab_div" v-if="scope.row.clt_cpn_batch_sn!=0">
                <div>
                  <span>总数量：</span>
                  <span>{{scope.row.clt_cpn_quantity}}</span>
                </div>
                <div>
                  <span>剩余数量：</span>
                  <span>{{scope.row.clt_cpn_remain_quantity}}</span>
                </div>
                <div>
                  <span>门槛价格：</span>
                  <span>{{scope.row.clt_cpn_min_amt | keepTwoNum}}</span>
                </div>
                <div>
                  <span>面额：</span>
                  <span>{{scope.row.clt_cpn_discount | keepTwoNum}}</span>
                </div>
                <div>
                  <span>起始时间：</span>
                  <p>{{scope.row.clt_cpn_start_time | getTimeFormat}}</p>
                </div>
                <div>
                  <span>截止时间：</span>
                  <p>{{scope.row.clt_cpn_end_time | getTimeFormat}}</p>
                </div>
              </div>
              <div class="tab_div" v-else>暂无</div>
            </template>
          </el-table-column>

          <el-table-column label="操作" min-width="100">
            <template slot-scope="scope">
              <el-button
                :loading="$store.state.isLoading"
                size="mini"
                @click="deleteGoods(scope.$index, scope.row.id)"
                type="danger"
              >删除</el-button>
            </template>
          </el-table-column>
        </el-table>
      </template>
      <template v-slot:footerLeft>
        <a class="aBtn aBtn_1 aBtn_lan2" @click="delSelection()">删除</a>
      </template>
    </tableComponents>
    <ddkGoodAdd :show="show_goods" v-if="show_goods" @isshow="getShow"></ddkGoodAdd>
  </div>
</template>
<script>
import ddkGoodAdd from "@/components/ddk/ddk_goods_add.vue";
import { ddkGoodsSearchData } from "../../assets/js/searchData/searchData"; //引入搜索的数据
export default {
  components: {
    ddkGoodAdd
  },
  props: [],
  data() {
    return {
      userSearchData: ddkGoodsSearchData,
      loading: false,
      show_goods: false,
      list: [],
      pageSize: 10,
      currentPage: 1,
      multipleSelection: [],
      searchObj: [],
      merchant_type: {
        1: "个人",
        2: "企业",
        3: "旗舰店",
        4: "专卖店",
        5: "专营店",
        6: "普通店"
      }
    };
  },
  methods: {
    getShow(bool) {
      this.show_goods = bool;
      this.get_data();
    },
    getSearch(val) {
      this.searchObj = val;
      this.get_data();
    },
    get_data(page, page_size) {
      this.loading = true;
      var data = this.searchObj;
      data.page = page || 1;
      data.page_size = page_size || this.pageSize;
      this.$api.getShops.ddk_goods_list(data).then(res => {
        if (res.data.code == 200) {
          this.list = res.data.result;
          this.currentPage = page;
        }
        this.loading = false;
      });
    },
    handleSizeChange(val) {
      this.get_data("", val);
      this.pageSize = val;
    },
    handleCurrentChange(val) {
       this.currentPage = val;
      this.get_data(val, this.pageSize);
    },
    handleSelectionChange(val) {
      //多选框赋值
      this.multipleSelection = val;
    },
    delSelection() {
      //批量删除
      var str = "";
      if (this.multipleSelection.length <= 0) {
        this.$message.error("未选择批量删除");
      } else {
        for (var i in this.multipleSelection) {
          str += this.multipleSelection[i].id + "@";
        }
        str = str.slice(0, -1);
        this.$swal({
          title: "您确定要删除这些信息吗",
          text: "删除后将无法恢复，请谨慎操作！",
          type: "warning",
          showCancelButton: true,
          confirmButtonColor: "#DD6B55",
          confirmButtonText: "是的，我要删除",
          cancelButtonText: "容我三思"
        }).then(willDelete => {
          if (willDelete.value) {
            var data = { id_str: str };
            this.$api.getShops.ddk_goods_del(data).then(res => {
              if (res.data.code == 200) {
                this.$swal("删除成功！", "您已经删除了这些信息。", "success");
                this.get_data();
              } else {
                this.$swal("删除失败！", "出错啦！", "error");
              }
            });
          }
        });
      }
    },
    deleteGoods(index, id) {
      this.$swal({
        title: "您确定要删除这条信息吗",
        text: "删除后将无法恢复，请谨慎操作！",
        type: "warning",
        showCancelButton: true,
        confirmButtonColor: "#DD6B55",
        confirmButtonText: "是的，我要删除",
        cancelButtonText: "容我三思"
      }).then(willDelete => {
        if (willDelete.value) {
          var data = { id_str: id };
          this.$api.getShops.ddk_goods_del(data).then(res => {
            if (res.data.code == 200) {
              this.$swal("删除成功！", "您已经删除了这条信息。", "success");
              this.get_data();
            } else {
              this.$swal("删除失败！", "出错啦！", "error");
            }
          });
        }
      });
    }
  },
  created() {
    this.get_data();
  },
  computed: {},
  watch: {}
};
</script>
